<%--
  Created by IntelliJ IDEA.
  User: lenovo
  Date: 2018/1/4
  Time: 9:48
  To change this template use File | Settings | File Templates.
--%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<!DOCTYPE HTML>
<html>

<head>
    <meta charset="UTF-8">
    <title>游戏得分</title>
    <link rel="stylesheet" type="text/css" href="<c:url value='/static/osyear/css/main.css'/>">
</head>

<body>
<div class="tpjg">
    <div class="tpjg_t">游戏得分</div>
    <div class="tpjg_ul1">
        <div>
            <div id="VoteMain"></div>
            <ul class="tpjg_ul2">
                <c:forEach var="gameResutl" items="${pager.list}" varStatus="vs">
                    <li>
                        <div class="li_c"></div>
                        <div class="li_e">${gameResutl.name}</div>
                    </li>
                </c:forEach>
            </ul>
        </div>

    </div>
</div>
<script language="JavaScript" src="<c:url value='/resource/js/osyear/jquery-1.11.0.js'/>"></script>
<script type="text/javascript">
    var timer;
    $(document).ready(function (result) {
        runajax();
        timer = setInterval(runajax, 5000);
    });
    var votojson;
    function runajax() {
        $.ajax({
            url: '<c:url value="/game/game-result"/>',
            type: "get",
            dataType: "json",
            success: function (data) {
//                console.log(data);
//                console.log(data.length);
               /* if (data[0].status == '1') {*/
                    votojson = [];
                    for (var i = 0; i < data.length; i++) {
                        votojson.push({Name: "&nbsp;", Value: data[i].score})
                    }
                    Vote.voteJson = votojson;

                    Vote.Init();
               /* }*/
              /*  if (data[0].status == '2') {
                    votojson = [];
                    for (var i = 0; i < data.length; i++) {
                        votojson.push({Name: "&nbsp;", Value: data[i].ticket})
                    }
                    Vote.voteJson = votojson;

                    Vote.Init();
                    clearInterval(timer);
                }*/
            },
            error: function () {
            }

        });
    }

    var Vote = {
        voteJson: [],
        Init: function () {
            document.getElementById("VoteMain").innerHTML = "";
            for (var i = 0; i < Vote.voteJson.length; i++) {
                var mName = Vote.voteJson[i].Name;
                var mImg = Vote.voteJson[i].Img;
                var mValue = Vote.voteJson[i].Value;
                var VoteItem = $("<div></div>");
                VoteItem.attr("class", "VoteItem");
                $("#VoteMain").append(VoteItem);
                var VoteValue = $("<div></div>");
                VoteValue.attr("class", "VoteValue");
                VoteValue.css("margin-top", 300 - 20 - mValue + "px");
                VoteValue.animate({height: mValue + "px"}, 500);
                VoteItem.append(VoteValue);

                var VoteSpan = $("<div>" + mValue + "</div>");
                VoteSpan.attr("class", "VoteSpan");
                VoteValue.append(VoteSpan);

                var VoteSpanTri = $("<span></span>");
                VoteSpanTri.attr("class", "VoteSpanTri");
                VoteSpan.append(VoteSpanTri);


                var VoteText = $("<p></p>");
                VoteText.html(mName);
                VoteText.attr("class", "VoteText");
                VoteItem.append(VoteText);
            }

        }
    }
</script>
</body>
</html>
